function ShowRankBar(node_id, rank_count, rank_score, pv) {
  $('#' + node_id).html('<div class="rank-plot" style="background-position:' 
      + (rank_score / 5.0 - 1.0) * 100 + 'px 50%"></div><div class="rank-desc"><span id="rank-score">'
      + rank_score + '</span>分(共<span id="rank-count">' + rank_count 
      + '</span>人评分)</div><div id="rank-icons"></div>');

  var rank_icons = $('#rank-icons');
  for(var i = 1; i < 6; ++i) {
    rank_icons.append($('<input class="rankicon" value="' + i + '" title="' + i + '分"></input>'));
  }

  $('.rankicon', rank_icons).click(
    function() {
      var p = $(this).parent();
      $('.rankicon').remove();
      p.append($('<span id="rank-state" style="color:#c36;">正在提交...</span>'));
      var score = $(this).val();
      $.ajax('/cgi/stat-rank?aid=' + article_id + '&score=' + score,
        {
          error : function(msg) {
            $('#rank-state').text('提交失败');
          },
          success : function(msg) {
            var rank = $.parseJSON(msg);
            $('#rank-count').text(rank['count']);
            $('#rank-score').text(rank['score']);
            $('#rank-state').text('评分成功！(' + score + '分)');
            var offset = (rank['score'] / 5.0 - 1.0) * 100;
            $('div.rank-plot').css({"background-position": offset + 'px 50%'});
          }
        }
      );
    }
  );

  $('.rankicon', rank_icons).hover(
    function() {
     var score = $(this).val();
     $('.rankicon').each(function() {
       var kid = $(this);
       if (kid.val() <= score) {
         kid.css('opacity', '1.0');
         kid.css('filter', 'alpha(opacity=100)');
       }
     });
    },
    function() {
      var score = $(this).val();
      $('.rankicon').each(function() {
          var kid = $(this);
          if (kid.val() <= score) {
            kid.css('opacity', '.2');
            kid.css('filter', 'alpha(opacity=20)');
          }
        }
      );
    }
  );
}

function ShowSnsBar() {
  var bar = $('#sns-share-bar');
  bar.html('<span style="float:left;color:#448;font-weight:normal;font-size:11px;line-height:18px;">分享到 : </span> <a id="renren-share" class="sns-share" title="人人网" href="#nogo"></a>'
    + '<a id="douban-share" class="sns-share" title="豆瓣" href="#nogo" ></a>'
    + '<a id="sina-t-share" class="sns-share" title="新浪微博" href="#nogo" ></a>'
    + '<a id="qq-t-share" class="sns-share" title="腾讯微博" href="#nogo" ></a>');
    
  var esc = encodeURIComponent;
  function GetWinParas(width, height) {
    var left = (screen.width - width) / 2;
    var top = (screen.height - height) / 2 - 10;
    return 'toolbar=0,resizable=1,scrollbars=yes,status=0,width=' 
      + width + ',height=' + height + ',top=' + top + ',left=' + left;
  }

  function Report(postfix) {
    $(document.body).append($('<img src="http://static.slowrose.com/stat/' + postfix + '"/>'));
  }

  $('#renren-share', bar).click(
    function() {
      var url = 'http://share.renren.com/share/buttonshare.do?link=' 
          + esc(location.href) + '&title=' + esc(document.title);
      window.open(url, 'renren', GetWinParas(606, 356));
      Report('share.png?aid=' + article_id + '&share=renren');
    }
  );
  $('#douban-share', bar).click(
    function() {
      var url = 'http://www.douban.com/recommend/?url=' + esc(location.href) + '&title=' + esc(document.title);
      window.open(url, 'douban', GetWinParas(470, 360));
      Report('share.png?aid=' + article_id + '&share=douban');
    }
  );

  $('#sina-t-share', bar).click(
    function() {
      var url = 'http://v.t.sina.com.cn/share/share.php?appkey=2566392091&url='
          + esc(location.href) + '&title=' + esc(document.title) + '&source=' + esc('SlowRose价值投资博客')
          + '&sourceUrl=' + esc('http://www.slowrose.com/') + '&content=utf-8&pic=';
      window.open(url, 'sina-t', GetWinParas(440, 430));
      Report('share.png?aid=' + article_id + '&share=sina-t');
    }
  );

  $('#qq-t-share', bar).click(
    function() {  
      var url = 'http://v.t.qq.com/share/share.php?title='+ esc(document.title)
        + '&url=' + esc(document.location) + '&site=' + esc('http://www.slowrose.com') + '&pic=';
      window.open(url, 'qq-t', GetWinParas(680, 480));
      Report('share.png?aid=' + article_id + '&share=qq-t');
    }
  );
}

$(document).ready(
  function() {
    ShowSnsBar();
    $.ajax('/cgi/stat-load?aid=' + article_id, 
      {
        success : function(msg) {
          var rank = $.parseJSON(msg);
          ShowRankBar('rank-bar', rank['count'], rank['score']);
        }
      }
    );
  }
);
